<script setup lang="ts">
import { ref, toRef, readonly, onBeforeMount } from "vue";
import service from "~/service";
const props = defineProps({
    user:Object
})
const user:any = props.user
console.log(user)
const identity = ref(user.identity || '')
const information = ref(user.information || '')
const identityList = ref<any[]>([])
onBeforeMount(async () => {
    const res = await service.syetem.getLookup('Indentity')
    if (res.code === 200 && res.data instanceof Array) {
        identityList.value = res.data
    }
})
const emit = defineEmits(['confirm']);
const handleConfirm = async()=>{
    const data = user;
    data.identity = identity.value;
    data.information = information.value
    const res = await service.customer.updateCustomer(data)
    if(res.code === 200){
        emit('confirm',true)
    }
}
const handleCancel = ()=>{
    emit('confirm',false)
}
</script>

<template>
    <div class="user-role">
        <el-radio-group v-model="identity">
            <el-radio v-for="role in identityList" :key="role.itemCode" :label="role.itemCode">{{role.itemName}}</el-radio>
        </el-radio-group>
        <div class="form-item">
            <div class="form-label">备注</div>
            <div class="form-value">
                <el-input type="textarea" style="width: 100%;" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入备注" v-model="information"></el-input>
            </div>
        </div>
        <div class="button">
            <el-button @click="handleCancel">取 消</el-button>
            <el-button type="primary" @click="handleConfirm">确 认</el-button>
        </div>
    </div>
</template>

<style lang="scss" scoped>
.user-role {
    .form-item {
        margin-top: 12px;
        display: flex;
        .form-label {
            width: 48px;
        }
        .form-value {
            width: 0;
            flex: 1;
        }
    }
    .button {
        margin-top: 24px;
        text-align: right;
    }
}
</style>
